.AppAdminReportRelation {
  .rootBoardHeader {
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    margin: 16px 16px 0;
    height: 56px;
    border-bottom: 1px solid #eaeaea;
    align-items: center;
    background: #fff;
    padding: 0 24px;
    box-sizing: border-box;
    color: #333333;
    .rootBoardHeaderTips {
      &:after {
        white-space: normal;
        width: 220px;
      }
    }
  }
  .rootBoard {
    @import "./tree.less";
    width: 100%;
    height: 100%;
    margin-bottom: 16px;
    padding-top: 0 !important;
    display: flex;
    flex-flow: column nowrap;
    &.rootBoardBox {
      .card {
        border-top-left-radius: 0;
        border-top-right-radius: 0;
        box-shadow: none;
      }
    }
    > .card {
      flex: 1 1 auto;
    }
    .title {
      height: 44px;
      line-height: 44px;
    }
    .wrapper {
      position: absolute;
      bottom: 20px;
      right: 20px;
      left: 20px;
      top: 14px;
      overflow: auto;
    }
    .searchBox {
      float: right;
      height: 30px !important;
      line-height: 32px !important;
      z-index: 2;
      margin-right: 15px;
      width: 260px;
      #searchText {
        height: 28px !important;
        width: 220px !important;
      }
    }
    .searchUserList {
      border: 1px solid #bdbdbd;
      border-radius: 3px;
      z-index: 2;
      top: 30px;
      position: absolute;
      max-height: 500px;
      overflow: auto;
      width: 260px;
      .nullDataDiv {
        background: #f5f5f5;
        height: 34px;
        line-height: 34px;
      }
      .resultItem {
        background: #f5f5f5;
        padding: 8px 16px;
        line-height: 20px;
        cursor: pointer;
        .info {
          display: flex;
          flex: 1 1 auto;
        }
        .department,
        .job {
          font-size: 12px;
          overflow: hidden;
          text-overflow: ellipsis;
          padding-right: 5px;
          box-sizing: border-box;
          white-space: nowrap;
        }
      }
    }
    .userItem {
      display: flex;
      flex-direction: row;
      padding: 10px 0;
      height: 60px;
      box-sizing: initial;
      .avatar {
        margin-left: 10px;
        flex: 0 0 48px;
        height: 48px;
        border-radius: 50%;
        align-self: center;
      }
      .info {
        flex: 1 0 0%;
        margin-left: 16px;
        padding-right: 10px;
        display: flex;
        flex-direction: column;
        .name,
        .department,
        .job {
          flex: 1 0 0%;
          max-width: 155px;
          overflow: hidden;
          white-space: nowrap;
          text-overflow: ellipsis;
          color: #9e9e9e;
          font-size: 12px;
        }
        .name {
          font-size: 15px;
          max-width: 135px;
          margin-bottom: 4px;
          color: #333;
        }
      }
      .subordinateCount {
        position: absolute;
        right: 50px;
        top: 10px;
      }
    }
    .noData {
      padding-top: 200px;
      .icon {
        font-size: 90px;
        color: #aaa;
        background: #f5f5f5;
        padding: 30px;
        border-radius: 50%;
      }
    }
  }
}
